<template>
    <div class="first_level_page">
        <div class="warehouse_info">
            <div class="warehouse_img left">
                <img src="../../images/goodsDefault.png">
            </div>
            <div class="warehouse_detail left">
                <div class="warehouse_name ellipsis">
                    河南东鹏快消品有限公司
                </div>
                <div class="warehouse_address ellipsis">
                    南阳路东风路2号仓库 Z37110002-001
                </div>
            </div> 
            <div class="arrow">
                <svg>
                    <use :xlink:href="'#moreArrow'"></use>
                </svg>
            </div>
        </div>
        <div class="warehouse_tab">
            <div class="tallying">
                <img src="../../images/tallying.png">
                理货处理中
            </div>
            <div class="logisticsing">
                <img src="../../images/logisticsing.png">
                物流处理中
            </div>
        </div>
        <div class="managementService">
            <div class="title">管理服务</div>
            <div class="service">
                <div class="service_demo">
                    <img src="../../images/warehouseManage.png"><br>
                    仓库管理
                </div>
                <router-link to="/category" class="service_demo">
                    <img src="../../images/scheduleManage.png"><br>
                    批货管理
                </router-link>
                <router-link to="/position" class="service_demo">
                    <img src="../../images/positionManage.png"><br>
                    岗位管理
                </router-link>
                <router-link to="/schedule" class="service_demo">
                    <img src="../../images/tallyManage.png"><br>
                    理货管理
                </router-link>
                <router-link to="/logistics" class="service_demo">
                    <img src="../../images/logisticsManage.png"><br>
                    物流管理
                </router-link>
            </div>
        </div>
        <foot-guide></foot-guide>
    </div>
</template>

<script>
    import footGuide from 'src/components/footer/footGuide'

    export default {
        data(){
            return{
            }
        },
        created() {
        },
        mounted(){
            
        },
        components: {
            footGuide,
        },
        methods: {
        },
    }
</script>

<style lang="scss" scoped>
    @import 'src/style/mixin';

    .warehouse_info{
        position: relative;
        @include wh(100%, 3.75rem);
        background: url(../../images/bgWarehouse.png) no-repeat;
        background-size: 100% 100%;
        .warehouse_img{
            padding: 1.2rem .14rem 1.14rem .3rem;
            img{
                float: left;
                @include wh(1.4rem, 1.4rem);
                border-radius: .7rem;
            }
        }
        .warehouse_detail{
            @include wh(5.66rem, 3.75rem);
            padding-right: .65rem;
            .warehouse_name{
                @include sc(.32rem, #fff);
                margin-top: 1.5rem;
                height: .32rem;
                line-height: .32rem;
            }
            .warehouse_address{
                height: .28rem;
                line-height: .28rem;
                @include sc(.28rem, #fff);
                margin-top: .24rem;
            }
        }
        .arrow{
            position: absolute;
            right: .2rem;
            top: 1.68rem;
            svg{
                float: left;
                @include wh(.25rem, .38rem);
            }
        }
    }
    .warehouse_tab{
        background: #fff;
        display: flex;
        @include wh(100%, 1.72rem);
        padding: .21rem 0;
        div{
            flex: 1;
            @include sc(.3rem, #999);
            text-align: center;
            line-height: 1.3rem;
        }
        img{
            @include wh(.8rem, .8rem);
            display: inline-block;
            vertical-align: middle;
        }
        .tallying{
            border-right: .01rem solid #ebebeb;
        }
    }
    .managementService{
        background: #fff;
        margin-top: .2rem;
        .title{
            @include wh(100%, .9rem);
            @include sc(.3rem, #0e0e0e);
            padding-left: .3rem;
            line-height: .9rem;
            border-bottom: .01rem solid #ebebeb;
        }
        .service{
            .service_demo{
                background: #fff;
                float: left;
                @include wh(33.33%, 1.92rem);
                @include sc(.26rem, #333);
                text-align: center;
                padding-top: .26rem;
                line-height: .26rem;
                border: .01rem solid #ebebeb;
                border-top: 0;
                border-left: 0;
                img{
                    @include wh(1.02rem, 1.02rem);
                }
            }
            .service_demo:nth-child(3n){
                border-right: 0;
            }
        }
    }
</style>